<!doctype html>
<html lang="en">

	<head>
		<meta charset="UTF-8" />
		<title>随鼠标移动的遮照</title>

		<style>
			.outer {
				position: relative;
				overflow: hidden;
				display: inline-block;
			}
		</style>

	</head>

	<body>

		<div class="outer">
			<img src="img/HBuilder.png" />
		</div>
		<div class="outer">
			<img src="img/HBuilder.png" />
		</div>

		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		
		
		<script src="maskMove1.js" type="text/javascript"></script>
		<script type="text/javascript">
			$(function(){
				//var maskmove = new maskMove($(".outer")); 繁琐
				
				maskMove.init($(".outer"))
			});
		</script>
		
		
		
		<!-- //第二版
		<script src="maskMove.js" type="text/javascript">
		</script>
		<script type="text/javascript">
			$(function() {
				$(".outer").maskMove({
					mask: $(".mask")
				})
			});
		</script>-->
	</body>

</html>